
<% 
    var headContent = {
%>
  <style type="text/css">
    body {
      background-color: #33B5E5;
    }
    #table-container{
      background-color: #33B5E5;
    }
    #img {
       /*float:left;*/
       padding-top:100px;
       padding-left: 60px;
       overflow-y:auto;
    }
  #login {
    /*float:right;*/
    margin-top:100px; 
    margin-right: 80px;
    padding: 20px 25px 0px 25px;
    width:380px;
    background: #ECEFF1;
    border-radius: 6px;
    text-align: center;
    -webkit-box-shadow: 2px 2px 3px #aaa;
    -moz-box-shadow: 2px 2px 3px #aaa;
    filter: progid:DXImageTransform.Microsoft.Shadow(Strength=3, Direction=135, Color='#999999');
    box-shadow: 2px 2px 0 rgba(0, 0, 0, 0.1);

  }
    
  #login h1 {
    display: block;
    margin-bottom: 20px;
    border-bottom: 1px solid #DFDFDF;
    text-align: center;
    height: 40px;
    line-height: 30px;
    color: #304b65;
    font-size: 21px;
    font-weight: 300;

  }
  .login-line-middle{
    margin-right: 80px;
    padding: 0px 25px;
    width:380px;
  }
  .login-circle{
    width: auto;
    height: 14px;
  }
  .login-line{
    width: 14px;
    height: 6px;
  }
  .login-line-img{
    width: 14px;
    height: 30px;
  }
   .login-zq {
    /* float:right; */
    /* margin-top:35px; */
    margin-right: 80px;
    padding: 0px 25px 60px 25px;
    width:380px;
    background: #ECEFF1;
    border-radius: 6px;
    text-align: center;
    -webkit-box-shadow: 2px 2px 3px #aaa;
    -moz-box-shadow: 2px 2px 3px #aaa;
    filter: progid:DXImageTransform.Microsoft.Shadow(Strength=3, Direction=135, Color='#999999');
    box-shadow: 2px 2px 0 rgba(0, 0, 0, 0.1);

    }
    .am-btn-success {
      color: #fff;
      background-color: #74AC0E;
      border-color: #74AC0E;
    }
    .login-img{
      position: absolute;
      z-index: 999;
      right: 350px;
      bottom: 126px;
    }
    .login-img-line{
      position: absolute;
      z-index: 1000;
      right: 350px;
      bottom: 137px;
    }
    .login-img-left,.login-img-line-left{
      right: 380px;
    }
    .login-img-right,.login-img-line-right{
      right: 140px;
    }
    .login-div{
      line-height: 0;
    }

    /* .login-line{
      width: 14px;
      height: 42px;
    } */
    

  </style>
<%
};
%>
<%layout("/common/_layout.html",{head:headContent}){ %>
    <!--[if lte IE 9]>
    <h1 class="browsehappy" style="text-align:center;color:#fff;">尊敬的用户您好，你正在使用<strong>过时</strong>的浏览器，本管理系统 暂不支持。 请 <a href="http://browsehappy.com/" target="_blank" style="color:yellow;">升级浏览器</a>
      以获得更好的体验！</h1>
    <![endif]-->
    <div class="am-g am-g-collapse">
      <div class="am-u-sm-4 am-u-md-6 am-u-lg-8" style="overflow: hidden;">
        <div id="img" style="overflow: hidden;">
          <image class="am-hide-md-down" src="${base}/img/login_bg.jpg">
        </div>
      </div>
      <div class="am-u-sm-8 am-u-md-6 am-u-lg-4">
        <div id="login">
          <h1>系统管理登录</h1>
          <form method="post" id="loginForm" class="am-form" action="${base}/admin/singIn" >
            <div class="am-form-group am-input-group">
              <span class="am-input-group-label"><i class="am-icon-user am-icon-fw"></i></span>
              <input type="text"  id="username" name="username" class="am-form-field" placeholder="输入你的用户名">
            </div>
            <div class="am-form-group am-input-group">
             <span class="am-input-group-label"><i class="am-icon-lock am-icon-fw"></i></span>
             <input type="password" class="am-form-field"  id="password" name="password" placeholder="输入你的密码">
            </div>
            <div class="am-form-group am-input-group">
              <span class="am-input-group-label"><i class="am-icon-key am-icon-fw"></i></span>
              <input type="text" class="am-form-field" id="captchaToken" name="captchaToken" placeholder="输入验证码">
              <span class="am-input-group-btn">
                <img id="captchaImage" src="${base}/captcha?width=100&height=35&fontsize=30" alt="换一张" />
              </span>
            </div>
            <div class="am-cf">
              <input id="loginBtn" type="submit" name="" value="登 录" class="am-u-sm-12 am-btn am-btn-primary am-btn-sm am-fl">           
            </div>
            <div id="msg" style="color: red">${errorMessages!}</div>
          </form>
          <div class="am-g">
            <div class="am-u-sm-6 am-u-md-6 am-u-lg-6 am-text-left" style="margin-top:12px;line-height:0;padding-left:12%;">
              <img class="login-circle" src="${base}/img/login_circle.png"/>
            </div>
            <div class="am-u-sm-6 am-u-md-6 am-u-lg-6 am-text-right" style="margin-top:12px;line-height:0;padding-right:12%;">
              <img class="login-circle" src="${base}/img/login_circle.png"/>
            </div>
          </div>
          <div class="am-g">
            <div class="am-u-sm-6 am-u-md-6 am-u-lg-6 am-text-left" style="line-height:0;margin-top:-1px;padding-left:12%;">
              <img class="login-line" src="${base}/img/login_line.png"/>
            </div>
            <div class="am-u-sm-6 am-u-md-6 am-u-lg-6 am-text-right" style="line-height:0;margin-top:-1px;padding-right:12%;">
              <img class="login-line" src="${base}/img/login_line.png"/>
            </div>
          </div>
        </div>
        <div class="login-line-middle">
          <div class="am-g am-g-collapse" style="line-height: 0;">
            <div class="am-u-sm-6 am-u-md-6 am-u-lg-6 am-text-left" style="line-height:0;padding-left:12%;">
              <img class="login-line-img" src="${base}/img/login_line.png"/>
            </div>
            <div class="am-u-sm-6 am-u-md-6 am-u-lg-6 am-text-right" style="line-height:0;padding-right:12%;">
              <img class="login-line-img" src="${base}/img/login_line.png"/>
            </div>
          </div>
        </div>
        <div class="login-zq">
          <div class="am-g am-g-collapse">
            <div class="am-u-sm-6 am-u-md-6 am-u-lg-6 am-text-left" style="line-height:0;padding-left:12%;">
              <img class="login-line" src="${base}/img/login_line.png"/>
            </div>
            <div class="am-u-sm-6 am-u-md-6 am-u-lg-6 am-text-right" style="line-height:0;padding-right:12%;">
              <img class="login-line" src="${base}/img/login_line.png"/>
            </div>
          </div>
          <div class="am-g">
            <div class="am-u-sm-6 am-u-md-6 am-u-lg-6 am-text-left" style="margin-top:-1px;margin-bottom:6px;line-height:0;padding-left:12%;">
              <img class="login-circle" src="${base}/img/login_circle.png"/>
            </div>
            <div class="am-u-sm-6 am-u-md-6 am-u-lg-6 am-text-right" style="margin-top:-1px;margin-bottom:6px;line-height:0;padding-right:12%;">
              <img class="login-circle" src="${base}/img/login_circle.png"/>
            </div>
          </div>
          <div class="am-text-default">
              政企终端销售功能请点击下方按钮登录
          </div>
          <form class="am-form">
              <input id="zqLoginBtn" type="button" name="" value="政 企 登 录" class="am-u-sm-12 am-btn am-btn-success am-btn-sm am-fl am-margin-top-sm">
          </form> 
        </div>
      </div>
    </div>
    <!-- <div class="login-img login-img-left">
      <div class="login-div">
        <img class="login-circle" src="${base}/img/login_circle.png"/>
      </div>
      <div class="login-div login-line"> </div>
      <div class="login-div">
        <img class="login-circle" src="${base}/img/login_circle.png"/>
      </div>
    </div>
    <div class="login-img login-img-right">
      <div class="login-div">
        <img class="login-circle" src="${base}/img/login_circle.png"/>
      </div>
      <div class="login-div login-line"></div>
      <div class="login-div">
        <img class="login-circle" src="${base}/img/login_circle.png"/>
      </div>
    </div>
    <div class="login-img-line login-img-left">
      <img class="login-line-img" src="${base}/img/login_line.png"/>
    </div>
    <div class="login-img-line login-img-right">
      <img class="login-line-img" src="${base}/img/login_line.png"/>
    </div> -->
    <script src="${base}/template/assets/js/amazeui.ie8polyfill.min.js"></script> 
    <script type="text/javascript" src="${base}/template/common/js/rsa/jsencrypt.min.js"></script>
    <script type="text/javascript">
      $().ready( function() {
            var $captcha = $("#captcha");
            var $captchaImage = $("#captchaImage");
                
            $captchaImage.click( function() {
                var timestamp = (new Date()).valueOf();
                var imageSrc = $captchaImage.attr("src");
                if(imageSrc.indexOf("?") >= 0) {
                    imageSrc = imageSrc.substring(0, imageSrc.indexOf("?"));
                }
                imageSrc = imageSrc + "?timestamp=" + timestamp + "&width=100&height=35&fontsize=30";
                $captchaImage.attr("src", imageSrc);
            });
            
        //登录
        $("#loginForm").submit(function(){

            var username = $.trim($("#username").val());
            var passwd = $.trim($("#password").val());
            var vcode = $.trim($("#captchaToken").val());
            if(username.length == 0) {
                $("#msg").html("用户名不能为空");
                return false;
            } else if(passwd.length == 0) {
                $("#msg").html("密码不能为空");
                return false;
            } else if(vcode.length != 4) {
                $("#msg").html("验证码错误");
                return false;
            }
            var encrypt = new JSEncrypt();
            encrypt.setPublicKey("${publickey}");
            console.log("${publickey}");
            var encrypted = encrypt.encrypt(passwd);
            console.log(encrypted);
            $("#password").val(encrypted);
            //$("#loginForm").submit();
        });

        $("#zqLoginBtn").on("click",function(){
          var domUrl = window.location.origin;
          if(domUrl.indexOf("dzg.vpclub.cn") != -1){//正式环境指定域名
            domUrl = window.location.protocol + "//dy.esstx.cn";//考虑到兼容换协议
          }

          window.open(domUrl + "/dy/admin/login");
        });
                
        });
    </script>
<%}%>

